{# 1.继承base基模板。将base.html的内容继承过来 #}
{% extends 'base.html' %}

{# 2.bokeh样式模块头部数据传输 #}
{% block head %}
    {{ js_resources|safe }}
    {{ css_resources|safe }}
{% endblock %}

{# 3.sidebar左侧菜单选项栏模块 #}
{% block sidebar %}
    <ul class="nav nav-sidebar">
        <li><a href="{{ url_for('mpg_view') }}">bokeh_MPG <span class="sr-only">(current)</span></a></li>
        <li class="active"><a href="{{ url_for('vbar') }}">Vbar</a></li>
        <li><a href="#">Analytics</a></li>
        <li><a href="#">Export</a></li>
    </ul>
    <ul class="nav nav-sidebar">
        <li><a href="">Nav item</a></li>
        <li><a href="">Nav item again</a></li>
        <li><a href="">One more nav</a></li>
        <li><a href="">Another nav item</a></li>
        <li><a href="">More navigation</a></li>
    </ul>
    <ul class="nav nav-sidebar">
        <li><a href="">Nav item again</a></li>
        <li><a href="">One more nav</a></li>
        <li><a href="">Another nav item</a></li>
    </ul>
{% endblock %}

{# 4. 右侧bokeh绘图区 #}
{% block plot %}
    {{ plot_script|safe }}
    {{ plot_div|safe }}
{% endblock %}

{# 5.右侧bokeh表格区 #}
{% block table %}
    <thead>
    {% for title in {{ the_titles }} %}
        <tr>
            <th>{{ title }}</th>
        </tr>
    {% endfor %}
    </thead>
    <tbody>
    {% for content in {{ the_contents }} %}
    <tr>
        {% for item in content %}
            <td>{{ item }}</td>
            </tr>
        {% endfor %}
    </tbody>
{% endblock %}